<!DOCTYPE html>
<html lang="zh">
	<head>
		<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<title>地图定位</title>
		<style type="text/css">
			html {
				height: 100%
			}

			body {
				height: 100%;
				margin: 0px;
				padding: 0px
			}

			#container {
				height: 100%
			}
		</style>
	</head>
	<body>
		<div id='container'></div>
	</body>
	<!-- 微信 JS-SDK 如果不需要兼容小程序，则无需引用此 JS 文件 -->
	<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>

	<!-- uni 的 SDK -->
	<script type="text/javascript" src="https://js.cdn.aliyun.dcloud.net.cn/dev/uni-app/uni.webview.1.5.2.js"></script>

	<!-- 百度地图 -->

	<script type="text/javascript"
		src="https://api.map.baidu.com/api?v=1.0&type=webgl&ak=Af6FfpOOZrHT1Ff2enuUKMZgjz4NfQ3W"></script>

	<!-- 示例文档 -->
	<!-- https://lbsyun.baidu.com/index.php?title=jspopularGL/guide/show -->

	<script type="text/javascript">
		document.addEventListener('UniAppJSBridgeReady', function() {
			// 配置百度地图
			var map = new BMapGL.Map("container"); // 创建地图实例
			var opts = {
				offset: new BMapGL.Size(10, 40)
			}
			var scaleCtrl = new BMapGL.ScaleControl(opts); // 添加比例尺控件
			map.addControl(scaleCtrl);
			var zoomCtrl = new BMapGL.ZoomControl(); // 添加缩放控件
			map.addControl(zoomCtrl);
			map.enableScrollWheelZoom(true); // 开启鼠标滚轮缩放
			var point = new BMapGL.Point(108.970588, 34.224352); // 创建点坐标
			map.centerAndZoom(point, 18); // 初始化地图，设置中心点坐标和地图级别

			// 浏览器定位
			var geolocation = new BMapGL.Geolocation();
			geolocation.getCurrentPosition(function(r) {
				if (this.getStatus() == BMAP_STATUS_SUCCESS) {
					var mk = new BMapGL.Marker(r.point);
					map.addOverlay(mk);
					map.panTo(r.point);
					// console.log('您的位置：' + r.point.lng + ',' + r.point.lat);
				} else {
					alert('failed' + this.getStatus());
				}
			});

			// IP地理位置定位
			// function myFun(result) {
			// 	var cityName = result.name;
			// 	map.setCenter(cityName);
			// 	console.log("当前定位城市:" + cityName);
			// }
			// var myCity = new BMapGL.LocalCity();
			// myCity.get(myFun);

			// 定位SDK辅助定位
			// var geolocation = new BMapGL.Geolocation();
			// // 开启SDK辅助定位
			// geolocation.enableSDKLocation();
			// geolocation.getCurrentPosition(function(r) {
			// 	if (this.getStatus() == BMAP_STATUS_SUCCESS) {
			// 		var mk = new BMapGL.Marker(r.point);
			// 		map.addOverlay(mk);
			// 		map.panTo(r.point);
			// 		console.log('您的位置：' + r.point.lng + ',' + r.point.lat);
			// 	} else {
			// 		alert('failed' + this.getStatus());
			//  }
			// });
		});
	</script>
</html>
